<!--
  @Descripttion:：隐私中心页面
  @Author：yejianbo
  @Date：2022年05月28日 00:53:48
-->
<template>
  <section class="page">
    <div class="item">
      <img class="left-icon" src="../../../assets/images/loa.png">
      <div class="right">
        <div class="title">法律协议</div>
        <div class="content-text">包含
          <span class="link" @click="linkTo('iframePage', 'ServicePolicy')">《用户服务协议》</span>、
          <span class="link" @click="linkTo('iframePage', 'PrivacyPolicy')">《隐私政策》</span>、
          <span class="link" @click="linkTo('iframePage', 'legalNotices')">《法律声明》</span>、
          <span class="link" @click="linkTo('iframePage', 'disclaimer')">《免责声明》</span>。
        </div>
      </div>
    </div>
    <!-- <div class="item">
      <img class="left-icon" src="../../../assets/images/loa.png">
      <div class="right">
        <div class="title">实名认证</div>
        <div class="content">填写姓名、身份证号</div>
      </div>
      <el-button class="right-button" type="primary">解绑</el-button>
    </div> -->
    <div v-if="!isAdmin" class="item">
      <img class="left-icon" src="../../../assets/images/loa.png">
      <div class="right">
        <div class="title">离开企业（账号注销）</div>
        <div class="content-text">xxxx</div>
      </div>
    </div>
    <div class="item">
      <img class="left-icon" src="../../../assets/images/loa.png">
      <div class="right">
        <div class="title">投诉与举报</div>
        <div class="content-text"><span style="margin-right: 30px;">违法不良举报电话：0755-23372611</span><span>广东省人力资源局： 020-12333</span></div>
      </div>
    </div>
  </section>
</template>

<script>
import { getIsAdmin } from '../../../api/company-admin-api/hireManage'
export default {
  // 组件名称
  name: 'PrivecyCenter',
  // 局部注册的组件
  components: {},
  // 组件状态值
  data() {
    return {
      isAdmin: false
    }
  },
  /**
   * 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
   */
  created() {
    this.fetchIsAdmin()
  },
  // 组件方法
  methods: {
    linkTo(routeName, pageUrl) {
      this.$router.push({ name: routeName, query: { pageUrl, showMenu: true }})
    },
    fetchIsAdmin() {
      getIsAdmin().then(res => {
        if (res.code === 0 && res.data) {
          this.isAdmin = res.data
        }
      })
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.page {
  position: relative;
  padding: 30px;
  .item {
    position: relative;
    padding: 30px 0;
    display: flex;
    flex-flow: row nowrap;
    border-bottom: 1px solid #e3e3e3;
    .left-icon{
      position: relative;
      width: 30px;
      height: 40px;
      float: left;
      margin-right: 30px;
    }
    .right {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-flow: column nowrap;
      .title {
        font-size: 20px;
        color:#000;
        font-weight: bold;
        margin-bottom: 10px;
      }
      .content-text {
        font-size: 16px;
        color: #747171;
        .link {
          color: #2F8EFE;
          cursor: pointer;
        }
      }
    }
    .right-button {
      position: absolute;
      right: 30px;
      top: 50%;
      transform: translateY(-50%);
    }
  }
}
</style>
